<template>
  <div>
    <div class="fwgm-wrap pos-re height100P">
      <img src="../../assets/imgs/fwgm_bg.png" class="height100P width100P">

      <div class="content width100P">
        <div class="flex justify-sa item">
          <div><img src="../../assets/imgs/qgwh_bg.png" class="item-img" @click="goDetails('qgwh')"></div>
          <div><img src="../../assets/imgs/gxsw_bg.png" class="item-img" @click="goDetails('gxsw')"></div>
          <div class="pos-re">
            <img src="../../assets/imgs/flxs_bg.png" class="item-img" @click="goDetails('flxs')">

            <div class="weixin-wrap">
              <img src="../../assets/imgs/erweima.png" class="ver-middle">
              <img src="../../assets/imgs/qq.png" class="ver-middle">
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "Fwgm",
  methods: {
    goDetails(pageName){
      this.$store.commit('SET_PAGENAME',pageName)
      this.$router.push('/fwgm-qgwh')
    }
  },
  components: {  }
};
</script>

<style scoped lang="scss">
  .fwgm-wrap{

    margin-top: -1px;

    .content{
      position: absolute;
      top: 50%;
      left: 50%;
      margin-left: -50%;
      margin-top: -150px;

      .item{
        .weixin-wrap{
          position: absolute;
          right: 60px;
          bottom: -80px;

          img:nth-child(1){
            width: 130px;
          }

          img:nth-child(2){
            width: 60px;
          }
        }
      }

      .item-img{
        width: 420px;
        height: 300px;
      }
    }
  }
</style>
